<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>@react-three/fiber Cesium Ion</title>
		<style>
			html {
				overflow: hidden;
				font-family: Arial, Helvetica, sans-serif;
				user-select: none;
			}

			#info {
				position: absolute;
				top: 0;
				left: 0;
				color: white;
				width: 100%;
				text-align: center;
				padding: 5px;
				pointer-events: none;
				line-height: 1.5em;
				z-index: 1;
			}

			#info a {
				color: white;
				pointer-events: all;
			}
		</style>
	</head>
	<body>
		<div id="info">
			Example using <a href="https://ion.cesium.com/">Cesium Ion</a> & <a href="https://r3f.docs.pmnd.rs">@react-three/fiber</a>.
			<br/>
			Paste your own Cesium Ion key to view other assets.
		</div>
		<div id="root"></div>
		<script type="module" src="./ion.jsx"></script>
	</body>
</html>
